<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><link rel="stylesheet" type="text/css" href="style.css"/>
<style type="text/css">
#apDiv1 {
	position: absolute;
	width: 685px;
	height: 601px;
	z-index: 1;
	left: 580px;
	top: 184px;
}
ul li
{
	font-size: 70px;
}
</style>
<link href="SpryAssets/SpryTabbedPanels.css" rel="stylesheet" type="text/css" />
<link href="SpryAssets/SpryAccordion.css" rel="stylesheet" type="text/css" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>网页设计介绍</title>
<script src="SpryAssets/SpryTabbedPanels.js" type="text/javascript"></script>
<script src="SpryAssets/SpryAccordion.js" type="text/javascript"></script>
</head>

<body>
<div class="main">
<table width="500" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td><a href="index.html"><img src="images/捕获2.PNG" width="60" height="60" /></a></td>
    <td>网页设计介绍</td>
  </tr>
  
</table>
<div class="i">
  <div id="TabbedPanels1" class="TabbedPanels">
    <ul class="TabbedPanelsTabGroup">
      <li class="TabbedPanelsTab" tabindex="0">主要内容</li>
      <li class="TabbedPanelsTab" tabindex="0">设计理念</li>
    </ul>
    <div class="TabbedPanelsContentGroup">
      <div class="TabbedPanelsContent">
        <div id="Accordion1" class="Accordion" tabindex="0">
          <div class="AccordionPanel" style="height: 400px;">
            <div class="AccordionPanelTab">内容</div>
            <div class="AccordionPanelContent" style="height:400px;">
              <p>1.首页</p>
              <p>2.生平事迹</p>
              <p>3.传奇故事</p>
              <p>4.主要作品</p>
              <p>5.留言</p>
              <p>6.作者介绍</p>
            </div>
          </div>
          <div class="AccordionPanel">
            <div class="AccordionPanelTab">其他</div>
            <div class="AccordionPanelContent">
              <p>1.图片</p>
              <p>2.背景音乐</p>
              <p>3.文本 </p>
            </div>
          </div>
        </div>
      </div>
      <div class="TabbedPanelsContent">
        <div id="Accordion2" class="Accordion" tabindex="0">
          <div class="AccordionPanel" style="height:400px;">
            <div class="AccordionPanelTab">选题</div>
            <div class="AccordionPanelContent" style="height: 400px; font-size: 36px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;我从小学就认识了迈克尔.杰克逊，那时的我只是单纯的觉得他唱歌好听，跳舞好看。后来，我知道了他去世的消息，才开始深入入去了解他。他原来是一个那么善良的人，简直就是一个天使。他不仅是一名歌唱家，舞蹈家，更是一名慈善家。他曾两次获得诺贝尔和平奖提名，救助了无数个儿童……</div>
          </div>
          <div class="AccordionPanel">
            <div class="AccordionPanelTab">运用知识</div>
            <div class="AccordionPanelContent">
              <p>1.插入了表格，表单。</p>
              <p>2.插入了背景音乐，背景图片及插图。</p>
              <p>3.整个网站内的网页运用统一的CSS样式。</p>
              <p>4.使用Div，AP div.,spry表单…… </p>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
  </div>
<p>&nbsp;</p>
</div>
<script type="text/javascript">
var TabbedPanels1 = new Spry.Widget.TabbedPanels("TabbedPanels1");
var Accordion1 = new Spry.Widget.Accordion("Accordion1");
var Accordion2 = new Spry.Widget.Accordion("Accordion2");
</script>
</body>
</html>
